<template>
	<div class="form-item-input">
		<el-row type="flex" justify="center">
			<el-col>
				<el-form :label-position="labelPosition" label-width="80px" :model="sizeForm">
				  <el-form-item :label="sizeForm.title+'：'">
					   <el-radio-group v-model="sizeForm.label" @change="changeRadio" ref="radioRed" >
					      <el-radio v-for="(lsit,index) in sizeForm.data"  :label='index' >{{lsit.value}}</el-radio>
					    </el-radio-group>
					  
				  </el-form-item>
				</el-form>
			</el-col>
		</el-row>
	 </div>
</template>

<script>
	export default {
	    data() {
	      return {
	        labelPosition: 'right',
	        sizeForm: {
			 id:'',
			 index: '',
			 title: '标签',
			 value: '',
			 data:[{
			 	value:"值"
			 }],
			 label:'1',
			 isNot:'0'
	        }
	      };
	    },
		props:['msgJsonApp'],
		mounted() {
			console.log(JSON.stringify(this.sizeForm))
			this.sizeForm=JSON.parse(this.msgJsonApp)
			
		},
		methods:{
			changeRadio(res){
				this.sizeForm.data.forEach((res,index)=>{
					if(index.toString()==this.sizeForm.label){
						this.sizeForm.value=res.value
					}
				})
			},
			showData(){
				var key = this.sizeForm.title
				var value = this.sizeForm.value
				var list = {}
				list[key] = value
				return list
			}
		},
		watch: {
			'msgJsonApp': {
				handler(newValue, oldValue) {
				   this.sizeForm=JSON.parse(this.msgJsonApp)
				},
				deep: true
			}
		}
	  }
</script>

<style>
	.layui-form-label{
		width: 100%;
		font-size: 12px;
	}
	.form-item-input{
		width: 60%;
		margin: auto;
		padding: 10px 10px 10px 10px;
		
	}
</style>
